import { Component } from 'react';
import Taro from '@tarojs/taro';
import { View } from '@tarojs/components'
import { fetchList } from '@/api/detection'
import Skeleton from './skeleton'
import './index.scss'
import List from './list'

type State = {
  list: Array<any>
  loadDone: boolean
  isShowNoData: boolean
};
export default class RecordList extends Component<{}, State> {

  constructor (props) {
    super(props)
    this.state = {
      loadDone: false,
      isShowNoData: false,
      list: []
    }
  }

  componentDidMount() {
    this.getList()
  }

  async getList() {
    try {
      let res: any = await fetchList()
      let data = res.data.data
      console.log(data)
      this.setState({
        loadDone: true,
        list: data,
        isShowNoData: data.length === 0
      })
    } catch (error) {
      console.log(error)
    } finally {

    }
  }

  handleAddCar() {
    Taro.navigateTo({
      url: `/pages/car/add/index?type=1`
    })
  }

  render() {
    const { list, loadDone, isShowNoData } = this.state
    console.log('list22', list)
    return (
      <View className="record-list">
        { loadDone && !isShowNoData ? <List list={list} /> : <View className='nadata-show'>暂无检测报告！</View>}
        { !loadDone && <Skeleton />}
      </View>
    )
  }
}
